<template>
	<div class="auditIndexContent">
		<div class="strategyMenus">
			<div class="strategyMenusBut">
				<div :class="tabIndexActiveIndex == 0 ? 'tabIndexActive' : ''" @click="tabIndexClick(0)">
					<span>发布内容</span>
					<!-- <span class="tabNumber">12</span> -->
				</div>
				<!-- <div :class="tabIndexActiveIndex == 1 ? 'tabIndexActive' : ''" @click="tabIndexClick(1)">
					<span>运维记录</span>
					<span class="tabNumber">12</span>
				</div> -->
				<!-- 设备状态 -->
				<!-- <div :class="tabIndexActiveIndex == 2 ? 'tabIndexActive' : ''" @click="tabIndexClick(2)">
					<span>设备状态</span>
					<span class="tabNumber">12</span>
				</div> -->
			</div>
			<div class="btns">
				<!-- <wj-Button type="save" @click="handleExport_select">批量导出</wj-Button> -->
				<el-date-picker
					v-model="exportLogsTimeHorizonValue"
					:picker-options="pickerOptions"
					format="yyyy-MM-dd"
					value-format="yyyy-MM-dd"
					type="daterange"
					range-separator="至"
					start-placeholder="开始日期"
					end-placeholder="结束日期"
					clearable
					@change="selectExportLogsTimeHorizonValueEvent"
				>
				</el-date-picker>
				<!-- <wj-Button type="save" @click="handleExport_all">全部导出</wj-Button> -->
				<wj-Button type="save" @click="handleExport">导出</wj-Button>
			</div>
			<div class="strategyMenusSearch">
				<el-input
					placeholder="请输关键字检索"
					type="text"
					v-model="searchValue"
					@keyup.enter.native="
						(e) => {
							e.target.blur();
						}
					"
					@blur="searchEvent"
				></el-input>
			</div>
		</div>
		<div class="strategyList">
			<el-table
				:data="tableData"
				ref="table_publishContent"
				style="width: 100%"
				v-customloading="partLoading"
				@selection-change="handleSelectionChange"
				v-if="tabIndexActiveIndex == 0"
				:row-class-name="'tableRowClassName'"
				:row-key="getRowKeys"
			>
				<el-table-column type="selection" width="80" label="序号" :reserve-selection="true"> </el-table-column>
				<el-table-column prop="publishTime" label="发布日期" width="180"> </el-table-column>
				<el-table-column prop="content" label="发布内容" show-overflow-tooltip>
					<template slot-scope="scope">
						<el-image
							v-if="scope.row.type === '2' || scope.row.type === 2"
							style="width: 24px; height: 24px; margintop: 7px"
							fit="cover"
							:src="scope.row.imagePateStr"
							:preview-src-list="[scope.row.imagePateStr]"
						>
							<div slot="error">
								<i class="wj-icon-24gl-pictureSplit"></i>
							</div>
						</el-image>

						<span v-else>
							{{ scope.row.content }}
						</span>
					</template>
				</el-table-column>
				<el-table-column prop="terminalName" label="情报板" width="180"> </el-table-column>
				<el-table-column prop="internalNumber" label="公桩号" width="180"> </el-table-column>
				<!-- <el-table-column prop="coord" label="位置信息" width="280"> </el-table-column> -->
				<el-table-column prop="ipAddress" label="前置装置IP" width="280"> </el-table-column>
				<el-table-column label="操作" width="80">
					<template slot-scope="scope">
						<el-link type="primary" @click="handleRowIssue(scope.$index, scope.row)">详情</el-link>
					</template>
				</el-table-column>
			</el-table>

			<el-table
				:data="tableData"
				style="width: 100%"
				v-customloading="partLoading"
				v-if="tabIndexActiveIndex == 1"
				:row-class-name="'tableRowClassName'"
			>
				<el-table-column type="index" width="50" label="序号"> </el-table-column>
				<el-table-column prop="operateTime" label="运维日期" width="280"> </el-table-column>
				<el-table-column prop="terminalName" label="终端设备"> </el-table-column>
				<el-table-column prop="ipAddress" label="设备IP" width="180"> </el-table-column>
				<el-table-column prop="internalNumber" label="公桩号" width="180"> </el-table-column>
				<!-- <el-table-column prop="coord" label="位置信息"> </el-table-column> -->
				<!-- <el-table-column prop="employee" label="运维负责人" width="180"> </el-table-column> -->
				<el-table-column label="操作" width="180">
					<template slot-scope="scope">
						<el-link type="primary" @click="handleRowOperation(scope.$index, scope.row)">详情</el-link>
					</template>
				</el-table-column>
			</el-table>

			<!-- 设备状态html -->
			<!-- <el-table
				:data="tableData"
				style="width: 100%"
				:default-sort="{ prop: 'terminal', order: 'descending' }"
				:cell-class-name="tableCellClassName"
				v-customloading="partLoading"
				v-if="tabIndexActiveIndex == 2"
			>
				<el-table-column type="index" width="50" label="序号"> </el-table-column>
				<el-table-column prop="terminal" label="设备名称" sortable width="180"> </el-table-column>
				<el-table-column prop="strategy" label="防火墙策略" width="280"> </el-table-column>
				<el-table-column prop="admittance" label="准入系统"> </el-table-column>
				<el-table-column prop="isStar" label="星标" width="180">
					<template slot-scope="scope">
						<i class="wj-icon-shoucang" v-if="scope.row.isStar == '是'"></i>
					</template>
				</el-table-column>
				<el-table-column label="操作" width="180">
					<template slot-scope="scope">
						<el-link type="primary" v-if="scope.row.isStar == '是'" @click="handleUnstar(scope.$index, scope.row)">取消星标</el-link>
						<el-link type="primary" v-if="scope.row.isStar == '否'" @click="handleStar(scope.$index, scope.row)">星标</el-link>
					</template>
				</el-table-column>
			</el-table> -->
		</div>
		<div class="strategyPage">
			<el-pagination
				background
				@size-change="handleSizeChange"
				@current-change="handleCurrentChange"
				:current-page="currentPage"
				:page-sizes="[11]"
				:page-size="pageSize"
				layout="total, prev, pager, next, jumper"
				:total="total"
			>
			</el-pagination>
		</div>
		<!-- 自定义alertBox弹框——详情 -->
		<AlertBox :alertBoxVisible="alertBoxIssueVisible">
			<div class="contentBox">
				<div class="contentBox_header">
					<p>发布信息详情</p>
					<i class="wj-icon-guanbi" @click="alertBoxIssueclose"></i>
				</div>
				<div class="contentBox_body">
					<div class="infoRow_details">
						<span>终端设备</span>
						<span>{{ everyItemContent.terminalName }}</span>
					</div>
					<div class="infoRow_details">
						<span>公桩号</span>
						<span>{{ everyItemContent.internalNumber }}</span>
					</div>
					<div class="infoRow_details">
						<span>发布内容</span>
						<template>
							<el-image
								v-if="everyItemContent.type === '2' || everyItemContent.type === 2"
								style="width: 36px; height: 36px"
								fit="cover"
								:src="everyItemContent.imagePateStr"
								:preview-src-list="[everyItemContent.imagePateStr]"
							>
								<div slot="error">
									<i class="wj-icon-24gl-pictureSplit"></i>
								</div>
							</el-image>
							<span v-else>
								{{ everyItemContent.content | contentFilter }}
							</span>
						</template>
					</div>
					<!--					<div class="infoRow_details">-->
					<!--						<span>位置信息</span>-->
					<!--						<span>{{ everyItemContent.coord }}</span>-->
					<!--					</div>-->
					<div class="infoRow_details">
						<span>发布时间</span>
						<span>{{ everyItemContent.publishTime }}</span>
					</div>
				</div>
				<div class="contentBox_footer">
					<wj-Button type="save" @click="handleDetailsConfirm">确定</wj-Button>
				</div>
			</div>
		</AlertBox>
		<!-- 自定义alertBox弹框——详情 -->
		<AlertBox :alertBoxVisible="alertBoxOperationVisible">
			<div class="contentBox">
				<div class="contentBox_header">
					<p>运维信息详情</p>
					<i class="wj-icon-guanbi" @click="alertBoxOperationclose"></i>
				</div>
				<div class="contentBox_body">
					<div class="infoRow_details">
						<span>维护时间</span>
						<span>{{ everyItemOperation.operateTime }}</span>
					</div>
					<div class="infoRow_details">
						<span>设备名称</span>
						<span>{{ everyItemOperation.terminalName }}</span>
					</div>
					<div class="infoRow_details">
						<span>设备IP</span>
						<span>{{ everyItemOperation.ipAddress }}</span>
					</div>
					<div class="infoRow_details">
						<span>公桩号</span>
						<span>{{ everyItemOperation.internalNumber }}</span>
					</div>
					<div class="infoRow_details">
						<span>事件时间</span>
						<span>{{ everyItemOperation.eventTime }}</span>
					</div>
				</div>
				<div class="contentBox_footer">
					<wj-Button type="save" @click="handleOperationConfirm">确定</wj-Button>
				</div>
			</div>
		</AlertBox>
	</div>
</template>
<script>
import {
	auditIndex_content,
	auditIndex_operation,
	auditIndex_content_Details,
	auditIndex_operation_Details,
	auditIndex_export_safety,
} from "@/utils/request/api.js";
export default {
	name: "AuditIndex",
	data() {
		return {
			// 搜索
			searchValue: "",
			// 分页当前页码
			currentPage: 1,
			// 总页码
			total: 0,
			// 每页条数
			pageSize: 10,
			// 分页初始化页码
			pageNum: 1,
			// 局部loading控制
			partLoading: false,
			// tab切换
			tabIndexActiveIndex: 0,
			// 表格数据
			tableData: [],
			multipleSelection: [],
			// 自定义弹窗控制——详情
			alertBoxIssueVisible: false,
			everyItemContent: {
				terminalName: "",
				content: "",
				coord: "",
				publishTime: "",
				internalNumber: "",
				type: "",
				imagePateStr: "",
			},
			// 自定义弹窗控制——详情
			alertBoxOperationVisible: false,
			everyItemOperation: {
				operateTime: "",
				terminalName: "",
				ipAddress: "",
				eventTime: "",
				internalNumber: "",
			},
			exportLogsTimeHorizonValue: [], // 导出日志时间范围
			pickerOptions: {
				disabledDate(time) {
					// 禁止选择未来的时间
					return (time.getTime() - (24 * 60 * 60 * 1000)) > Date.now();
				},
			},
		};
	},
	created() {},
	mounted() {
		this.tabDataTable();
		this.getAudit_content(this.pageNum, this.pageSize, "", "", "");
	},
	//过滤器
	filters: {
		contentFilter(value) {
			let contentStr = "";
			value.split(",").forEach((item) => {
				contentStr += item.split("/")[0] + ",";
			});
			return contentStr.slice(0, -1);
		},
	},
	methods: {
		// 时间控件事件
		selectExportLogsTimeHorizonValueEvent(date) {
			console.log(date);
			if (date != null && date != undefined && date.length > 0) {
				this.getAudit_content(this.pageNum, this.pageSize, "", date[0], date[1]);
			} else {
				this.getAudit_content(this.pageNum, this.pageSize, "", "", "");
			}
		},
		// table行数据的 Key （用来缓存选中数据）
		getRowKeys(row) {
			return row.id;
		},
		// tab切换
		tabIndexClick(index) {
			this.tabIndexActiveIndex = index;
			this.tabDataTable();
		},
		tabDataTable() {
			this.partLoading = true;
			if (this.tabIndexActiveIndex == 0) {
				this.getAudit_content(this.pageNum, this.pageSize, "", "", "");
			} else if (this.tabIndexActiveIndex == 1) {
				this.getAudit_operation(this.pageNum, this.pageSize);
			}
			/* 设备状态  js 数据*/
			// else if (this.tabIndexActiveIndex == 2) {
			// 	this.tableData = [
			// 		{
			// 			terminal: "G20兰海高速-北向南-001",
			// 			strategy: "操作系统保留端口防护",
			// 			admittance: "情报发布系统主站(123.123.123.123)",
			// 			isStar: "是",
			// 		},
			// 		{
			// 			terminal: "G20兰海高速-北向南-001",
			// 			strategy: "操作系统保留端口防护",
			// 			admittance: "情报发布系统主站(123.123.123.123)",
			// 			isStar: "是",
			// 		},
			// 		{
			// 			terminal: "G20兰海高速-北向南-001",
			// 			strategy: "操作系统保留端口防护",
			// 			admittance: "情报发布系统主站(123.123.123.123)",
			// 			isStar: "是",
			// 		},
			// 		{
			// 			terminal: "G20兰海高速-北向南-001",
			// 			strategy: "操作系统保留端口防护",
			// 			admittance: "情报发布系统主站(123.123.123.123)",
			// 			isStar: "否",
			// 		},
			// 		{
			// 			terminal: "G20兰海高速-北向南-001",
			// 			strategy: "操作系统保留端口防护",
			// 			admittance: "情报发布系统主站(123.123.123.123)",
			// 			isStar: "否",
			// 		},
			// 	];
			// 	setTimeout(() => {
			// 		this.partLoading = false;
			// 	}, 1000);
			// }
		},
		// 搜索
		searchEvent() {
			console.log(this.searchValue);
			this.currentPage = 1;
			this.total = 0;
			this.pageSize = 10;
			this.pageNum = 1;
			this.partLoading = true;
			if (this.tabIndexActiveIndex == 0) {
				if (this.exportLogsTimeHorizonValue.length > 0) {
					this.searchAudit_content(
						this.pageNum,
						this.pageSize,
						this.searchValue,
						this.exportLogsTimeHorizonValue[0],
						this.exportLogsTimeHorizonValue[1]
					);
				} else {
					this.searchAudit_content(this.pageNum, this.pageSize, this.searchValue, "", "");
				}
			} else if (this.tabIndexActiveIndex == 1) {
				this.searchAudit_operation(this.pageNum, this.pageSize, this.searchValue);
			}
			this.searchValue = "";
		},
		// 分页组件事件
		handleSizeChange(val) {
			console.log(`每页 ${val} 条`);
		},
		handleCurrentChange(val) {
			console.log(`当前页: ${val}`);
			this.partLoading = true;
			if (this.tabIndexActiveIndex == 0) {
				if (this.searchValue != "" && this.exportLogsTimeHorizonValue.length <= 0) {
					this.searchAudit_content(val, this.pageSize, this.searchValue, "", "");
				} else if (this.searchValue != "" && this.exportLogsTimeHorizonValue.length > 0) {
					this.searchAudit_content(
						val,
						this.pageSize,
						this.searchValue,
						this.exportLogsTimeHorizonValue[0],
						this.exportLogsTimeHorizonValue[1]
					);
				} else if (this.exportLogsTimeHorizonValue.length > 0) {
					this.getAudit_content(this.pageNum, this.pageSize, "", this.exportLogsTimeHorizonValue[0], this.exportLogsTimeHorizonValue[1]);
				} else {
					this.getAudit_content(val, this.pageSize, "", "", "");
				}
			} else if (this.tabIndexActiveIndex == 1) {
				if (this.searchValue != "") {
					this.getAudit_operation(val, this.pageSize, this.searchValue);
				} else {
					this.searchAudit_operation(val, this.pageSize);
				}
			}
			/* 设备状态  js 数据*/
			// else if (this.tabIndexActiveIndex == 2) {
			// 	this.getAudit_device(val, this.pageSize);
			// 	setTimeout(() => {
			// 		this.partLoading = false;
			// 	}, 1000);
			// }
		},
		// 设备状态  js  方法
		// // 标记星标
		// handleStar(index, row) {
		// 	console.log(index, row);
		// },
		// // 取消星标
		// handleUnstar(index, row) {
		// 	console.log(index, row);
		// },
		// 表格选中
		handleSelectionChange(val) {
			this.multipleSelection = val;
			console.log(this.multipleSelection);
		},
		// 发布内容——详情
		handleRowIssue(index, row) {
			console.log(index, row);
			this.alertBoxIssueVisible = true;
			this.getAudit_content_details(row.id);
		},
		// 运维记录——详情
		handleRowOperation(index, row) {
			console.log(index, row);
			this.alertBoxOperationVisible = true;
			this.getAudit_operation_details(row.id);
		},
		// 已读和未读——文字样式
		tableCellClassName({ row, column, rowIndex, columnIndex }) {
			console.log(row);
			console.log(rowIndex);
			console.log(column);
			console.log(columnIndex);
			if (columnIndex == 2) {
				return "forbidden-cell-strategy";
			}
			return "";
		},
		// alertBox——发布内容——详情 关闭
		alertBoxIssueclose() {
			this.alertBoxIssueVisible = false;
		},
		//  alertBox——发布内容——详情 确认
		handleDetailsConfirm() {
			this.alertBoxIssueVisible = false;
		},
		// alertBox——运维记录——详情 关闭
		alertBoxOperationclose() {
			this.alertBoxOperationVisible = false;
		},
		// alertBox——运维记录——详情 确认
		handleOperationConfirm() {
			this.alertBoxOperationVisible = false;
		},
		// 发布内容历史记录过滤内容（去掉颜色数值代码）
		contentFilter(value) {
			let contentStr = "";
			value.split(",").forEach((item) => {
				contentStr += item.split("/")[0] + ",";
			});
			return contentStr.slice(0, -1);
		},
		// 获取数据——发布内容
		getAudit_content(page, size, value, startDateStr, endDateStr) {
			auditIndex_content({
				page: page,
				size: size,
				keyword: value,
				startDateStr: startDateStr,
				endDateStr: endDateStr,
			}).then((res) => {
				console.log(res);
				this.partLoading = false;
				if (res.code == 200) {
					res.data.result.forEach((item) => {
						if (item.imageName) {
							item.imagePateStr = "https://" + window.location.host + "/images/" + item.imageName;
						} else {
							item.content = this.contentFilter(item.content);
						}
					});
					this.tableData = res.data.result;
					this.total = res.data.total;
				} else {
					this.$msg.error("发布内容获取失败！");
				}
			});
		},
		// 搜索发布内容
		searchAudit_content(page, size, value, startDateStr, endDateStr) {
			auditIndex_content({
				page: page,
				size: size,
				keyword: value,
				startDateStr: startDateStr,
				endDateStr: endDateStr,
			}).then((res) => {
				console.log(res);
				this.partLoading = false;
				if (res.code == 200) {
					res.data.result.forEach((item) => {
						if (item.imageName) {
							item.imagePateStr = "https://" + window.location.host + "/images/" + item.imageName;
						} else {
							item.content = this.contentFilter(item.content);
						}
					});
					this.tableData = res.data.result;
					this.total = res.data.total;
				} else {
					this.$msg.error("发布内容检索失败！");
				}
			});
		},
		// 发布内容  详情
		getAudit_content_details(id) {
			auditIndex_content_Details({
				id: id,
			}).then((res) => {
				console.log(res);
				res.data.imagePateStr = "https://" + window.location.host + "/images/" + res.data.imageName;
				this.everyItemContent = res.data;
			});
		},
		// 获取数据——运维记录
		getAudit_operation(page, size) {
			auditIndex_operation({
				page: page,
				size: size,
			}).then((res) => {
				console.log(res);
				this.partLoading = false;
				this.tableData = res.data.result;
				// this.currentPage = res.data.pages;
				this.total = res.data.total;
			});
		},
		// 搜索运维记录
		searchAudit_operation(page, size, value) {
			auditIndex_operation({
				page: page,
				size: size,
				keyword: value,
			}).then((res) => {
				console.log(res);
				this.partLoading = false;
				this.tableData = res.data.result;
				// this.currentPage = res.data.pages;
				this.total = res.data.total;
			});
		},
		// 运维记录  详情
		getAudit_operation_details(id) {
			auditIndex_operation_Details({
				id: id,
			}).then((res) => {
				console.log(res);
				this.everyItemOperation = res.data;
			});
		},
		// 获取数据——设备状态
		// getAudit_device(page, size) {
		// 	auditIndex_device({
		// 		page: page,
		// 		size: size,
		// 	}).then((res) => {
		// 		console.log(res);
		// 		this.tableData = res.data.result;
		// 		// this.currentPage = res.data.pages;
		// 		this.total = res.data.total;
		// 	});
		// },
		// 批量导出
		handleExport_select() {
			console.log(this.multipleSelection);
			if (this.multipleSelection.length > 0) {
				var idList = [];
				this.multipleSelection.forEach((item) => {
					idList.push(item.id);
				});
				console.log(decodeURIComponent(idList));
				auditIndex_export_safety({
					publishIdList: decodeURIComponent(idList),
				})
					.then((res) => {
						console.log(res);
						// if (res.code == 200) {
						this.$msg.success("安全审计批量导出成功！");
						let content = res.data;
						let blob = new Blob([content], { type: "application/vnd.ms-excel;charset=UTF-8" });
						let fileName = decodeURI(res.headers["content-disposition"].split(";")[1].split("=")[1]); //自定义下载文件的名字
						if ("download" in document.createElement("a")) {
							// 非IE下载
							let elink = document.createElement("a");
							elink.download = fileName;
							elink.style.display = "none";
							elink.href = URL.createObjectURL(blob);
							document.body.appendChild(elink);
							elink.click();
							URL.revokeObjectURL(elink.href); // 释放URL 对象
							document.body.removeChild(elink);
						} else {
							// IE10+下载
							navigator.msSaveBlob(blob, fileName);
						}
						// } else {
						// 	this.$msg.error("安全审计批量导出失败！");
						// }
					})
					.catch((err) => {
						console.log(err);
						this.$msg.error("安全审计批量导出失败！");
					});
			}
		},
		// 全部导出
		handleExport_all() {
			if (this.tableData == null || this.tableData.length <= 0) {
				this.$msg.warning("暂无可导出的数据！");
			} else {
				auditIndex_export_safety({
					publishIdList: decodeURIComponent([]),
				})
					.then((res) => {
						console.log(res);
						// if (res.code == 200) {
						this.$msg.success("安全审计全部导出成功！");
						let content = res.data;
						let blob = new Blob([content], { type: "application/vnd.ms-excel;charset=UTF-8" });
						let fileName = decodeURI(res.headers["content-disposition"].split(";")[1].split("=")[1]); //自定义下载文件的名字
						if ("download" in document.createElement("a")) {
							// 非IE下载
							let elink = document.createElement("a");
							elink.download = fileName;
							elink.style.display = "none";
							elink.href = URL.createObjectURL(blob);
							document.body.appendChild(elink);
							elink.click();
							URL.revokeObjectURL(elink.href); // 释放URL 对象
							document.body.removeChild(elink);
						} else {
							// IE10+下载
							navigator.msSaveBlob(blob, fileName);
						}
						// } else {
						// 	this.$msg.error("安全审计全部导出失败！");
						// }
					})
					.catch((err) => {
						console.log(err);
						this.$msg.error("安全审计全部导出失败！");
					});
			}
		},
		// 导出
		handleExport() {
			if (this.tableData == null || this.tableData.length <= 0) {
				this.$msg.warning("暂无可导出的数据！");
			} else {
				if (this.multipleSelection.length <= 0 && this.exportLogsTimeHorizonValue.length <= 0) {
					// 导出全部
					auditIndex_export_safety({
						publishIdList: decodeURIComponent([]),
						startDateStr: "",
						endDateStr: "",
					})
						.then((res) => {
							console.log(res);
							// if (res.code == 200) {
							this.$msg.success("安全审计全部导出成功！");
							this.actualDownload(res);
						})
						.catch((err) => {
							console.log(err);
							this.$msg.error("安全审计导出失败！");
						});
				} else if (this.multipleSelection.length <= 0 && this.exportLogsTimeHorizonValue.length > 0) {
					// 时间范围导出
					auditIndex_export_safety({
						publishIdList: decodeURIComponent([]),
						startDateStr: this.exportLogsTimeHorizonValue[0],
						endDateStr: this.exportLogsTimeHorizonValue[1],
					})
						.then((res) => {
							console.log(res);
							this.$msg.success("安全审计时间范围内数据导出成功！");
							this.exportLogsTimeHorizonValue = [];
							this.actualDownload(res);
						})
						.catch((err) => {
							console.log(err);
							this.$msg.error("安全审计导出失败！");
						});
				} else if (this.multipleSelection.length > 0 && this.exportLogsTimeHorizonValue.length <= 0) {
					// 选中导出
					var idList = [];
					this.multipleSelection.forEach((item) => {
						idList.push(item.id);
					});
					auditIndex_export_safety({
						publishIdList: decodeURIComponent(idList),
						startDateStr: "",
						endDateStr: "",
					})
						.then((res) => {
							console.log(res);
							this.$msg.success("安全审计选中数据导出成功！");
							this.$refs.table_publishContent.clearSelection();
							this.multipleSelection = [];
							this.actualDownload(res);
						})
						.catch((err) => {
							console.log(err);
							this.$msg.error("安全审计导出失败！");
						});
				} else if (this.multipleSelection.length > 0 && this.exportLogsTimeHorizonValue.length > 0) {
					// 时间范围内选中导出
					var idList_ = [];
					this.multipleSelection.forEach((item) => {
						idList_.push(item.id);
					});
					auditIndex_export_safety({
						publishIdList: decodeURIComponent(idList_),
						startDateStr: this.exportLogsTimeHorizonValue[0],
						endDateStr: this.exportLogsTimeHorizonValue[1],
					})
						.then((res) => {
							console.log(res);
							this.$msg.success("安全审计时间范围内选中数据导出成功！");
							this.exportLogsTimeHorizonValue = [];
							this.$refs.table_publishContent.clearSelection();
							this.multipleSelection = [];
							this.actualDownload(res);
						})
						.catch((err) => {
							console.log(err);
							this.$msg.error("安全审计导出失败！");
						});
				}
			}
		},
		// 实际下载
		actualDownload(res) {
			let content = res.data;
			let blob = new Blob([content], { type: "application/vnd.ms-excel;charset=UTF-8" });
			let fileName = decodeURI(res.headers["content-disposition"].split(";")[1].split("=")[1]); //自定义下载文件的名字
			if ("download" in document.createElement("a")) {
				// 非IE下载
				let elink = document.createElement("a");
				elink.download = fileName;
				elink.style.display = "none";
				elink.href = URL.createObjectURL(blob);
				document.body.appendChild(elink);
				elink.click();
				URL.revokeObjectURL(elink.href); // 释放URL 对象
				document.body.removeChild(elink);
			} else {
				// IE10+下载
				navigator.msSaveBlob(blob, fileName);
			}
			// 重新查询
			this.currentPage = 1;
			this.total = 0;
			this.pageSize = 10;
			this.pageNum = 1;
			this.getAudit_content(this.pageNum, this.pageSize, "", "", "");
		},
	},
};
</script>
<style lang="less" scoped>
.auditIndexContent {
	width: 100%;
	height: 100%;
	padding: 12px 20px;
	box-sizing: border-box;
	background: #ffffff;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	.strategyMenus {
		width: 100%;
		height: 48px;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		.strategyMenusBut {
			width: 55%;
			height: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			div {
				width: 145px;
				height: 36px;
				font-size: 14px;
				line-height: 36px;
				border: 1px solid #d8d8d8;
				border-right: none;
				background: #f2f2f2;
				color: #82b808;
				text-align: center;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				span {
					display: inline-block;
					height: 18px;
					line-height: 18px;
				}
				span:first-child {
					margin-right: 12px;
				}
				span.tabNumber {
					border: 1px solid #d8d8d8;
					padding: 2px 4px;
					text-align: center;
				}
			}
			div:last-child {
				border-right: 1px solid #d8d8d8;
			}
			div.tabIndexActive {
				background: #fff;
				color: #333333;
			}
			div:hover {
				cursor: pointer;
			}
		}
		.btns {
			width: 30%;
			height: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			[class*="wj-button-"] {
				font-size: 14px;
				padding: 8px 18px;
				margin-left: 18px;
			}
		}
		.strategyMenusSearch {
			width: 15%;
			height: 100%;
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			align-items: center;
			/deep/ .el-input {
				font-size: 16px;
			}
		}
	}
	.strategyList {
		width: 100%;
		height: calc(100% - 48px - 48px);
		padding: 28px 0;
		box-sizing: border-box;
		/deep/ .el-table {
			border-left: 1px solid #ebeef5;
			border-right: 1px solid #ebeef5;
			border-top: 1px solid #ebeef5;
		}
		/deep/ .el-link {
			margin: 0 12px 0 0;
		}
		/deep/ .el-table .forbidden-cell-strategy .cell {
			color: #67c23a;
		}
		.wj-icon-shoucang {
			color: #ea9518;
		}
	}
	.strategyPage {
		width: 100%;
		height: 48px;
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
	}
}
</style>
